<template>
  <div class="other-login" v-if="defaultSettings.showOtherLogin">
    <div class="other-tip">
      <div class="horizontal-line"></div>
      <div class="title">{{ $t("login.otherLoginWay") }}</div>
      <div class="horizontal-line"></div>
    </div>

    <div class="icon">
      <span @click="onAuth('GITHUB')" title="github"
        ><svg-icon name="github" className="login-icon"></svg-icon
      ></span>
      <span @click="onAuth('WEIXIN')" title="weixin"
        ><svg-icon name="weixin" className="login-icon"></svg-icon
      ></span>
    </div>

    
  </div>
</template>
<script setup>
import defaultSettings from "@/settings";
import useUserStore from "@/store/modules/user";
const userStore = useUserStore();
const { proxy } = getCurrentInstance();
function onAuth(type) {
  userStore.setAuthSource(type);

  switch (type) {
    default:
      // window.location.href = import.meta.env.VITE_APP_BASE_API + '/auth/Authorization?authSource=' + type
      proxy.$modal.msg(
        "暂未实现该功能"
      );
      break;
  }
}
</script>
<style lang="scss" scoped>
.other-login {
  padding: 0px 20px 10px;

  .other-tip {
    text-align: center;
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
    height: 26px; /* 设置父元素高度，以便垂直居中生效 */
    color: #ccc;
    font-size: 13px;
    margin-top: 10px;
    .horizontal-line {
      border-top: 1px solid #ccc; /* 设置顶部边框为 1 像素宽的灰色线条 */
      margin: 20px 0; /* 上下外边距 */
      width: 80px;
    }
    .title {
      margin: 0 6px;
    }
  }
  .icon {
    text-align: center;
    width: 100%;

    .login-icon {
      width: 25px;
      height: 25px;
      margin:10px 20px;
      cursor: pointer;
    }
  }
  .agreement{
    text-align: center;
    width: 100%;
    font-size: 8px;
    color: #757575;
    margin: 6px 0;
  }
}
</style>
